import { createRenderer } from '@vue/runtime-core'
import { Graphics, Text } from 'pixi.js'

const renderer = createRenderer({
    createElement(type) {
        console.log(type)
        let element;
        if(type === 'ract') {
            element = new Graphics();
            element.beginFill(0xff0000);
            element.drawRect(0,0,200,200);
            element.endFill()
        }else if(type === 'circle') {
            element = new Graphics();
            element.beginFill(0xffff00);
            element.drawCircle(100,100,50);
            element.endFill();
        }

        return element
    },
    patchProp(el,key,prevValue,nextValue) {
        console.log(key,nextValue)
        // pixi 
        if(key === 'x') {
            el.x = nextValue
        }
        if(key === 'y') {
            el.y = nextValue
        }
    },
    createComment(text) {
        return new Text(text)
    },
    createText(text) {
        return new Text(text)
    },
    setElementText(node,text) {
        const cText = new Text(text);
        node.addChild(cText);
    },
    insert(el,parent) {
        parent.addChild(el)
    }
})

export function createApp(rootComponent) {
    return renderer.createApp(rootComponent)
}